﻿<!doctype html>
<html>

<head>
	<meta charset="utf-8">
	<title>绑定手机</title>
	<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
	<link rel="stylesheet" href="/lobsteruiframe/weui/css/weui.css" />
	<link rel="stylesheet" href="/lobsteruiframe/weui/css/weuix.css" />
	<script src="/lobsteruiframe/weui/js/zepto.min.js"></script>
	<script src="/lobsteruiframe/weui/js/zepto.weui.js"></script>
	<script src="/jslib/lobster.js"></script>

</head>
	<body ontouchstart>
		<div class="weui-btn_default weui-header ">
			<div class="weui-header-left"> <a class="icon icon-109 f-green" href="#"
					onclick="self.location=document.referrer;"></a> </div>
			<h1 class="weui-header-title f-green">绑定手机</h1>
		</div>

		<div class="page-hd">
			<h1 class="page-hd-title">
				绑定
			</h1>
			<p class="page-hd-desc">输入手机号码获取短信验证码进行绑定</p>
		</div>
		<div class="page-bd-15">
			<div class="weui-cells weui-cells_form">
				<div class="weui-cell">
					<div class="weui-cell__hd">
						<label class="weui-label">手机号</label>
					</div>
					<div class="weui-cell__bd">
						<input class="weui-input" placeholder="请输入手机号" type="tel" id="mobile">
					</div>

				</div>
				<div class="weui-cell weui-cell_vcode">
					<div class="weui-cell__hd">
						<label class="weui-label">验证码</label>
					</div>
					<div class="weui-cell__bd">
						<input class="weui-input" placeholder="验证码" type="number" id="code">
					</div>
					<div class="weui-cell__ft">
						<button class="weui-vcode-btn" id="SendMsgCode">获取验证码</button>
					</div>
				</div>

			</div>
			<div class="weui-cells__tips"></div>
			<div class="weui-btn-area">
				<a href="javascript:void(0);" class="weui-btn weui-btn_primary" id="bind">绑定</a>
			</div>
		</div>
	</body>

</html>


<script>
    lobsterh5.main({
			data: {
				codeDuration: 0, //发送短信读秒
				loginBtnLoading: false,
				backUrl: '', //回调地址
				smsKey: '', //短信密钥
				user: {}, //微信用户信息
			},
			//初始化页面
			pageload: function () {
				this.initevent();
				this.data.backUrl = lobsterh5.GetUrlParam("backUrl");
				this.data.user = JSON.parse(decodeURI(lobsterh5.GetUrlParam("user")));
				if (!this.data.user || !this.data.backUrl) {
                    $.toast("无效参数", "forbidden");
                }
			},
			//初始化事件
			initevent: function () {
				var self = this;
				$("#SendMsgCode").click(function () {
					self.sendSmsCode();
				})
				$("#bind").click(function () {
					self.bindlogin();
				})
			},
			//发送验证码
			sendSmsCode: function () {
				var self = this;
				var mobile = $("#mobile").val();
				if (!mobile) {
					$.toast("请输入手机号码", "forbidden");
					return
				}
				if (!/^1\d{10}$/.test(mobile)) {
					$.toast("手机号码填写错误", "forbidden");
					return
				}

                lobsterh5.GET("/admin/v1/CLogin/SendSmsVerCode", { phoneNumber: mobile, smsKey: "" }).then(data => {
                    self.data.smsKey = data.smsKey;
                    $.toast('验证码发送成功，请注意查收', 'text');
                    $("#SendMsgCode").attr("disabled", true);
                    self.data.codeDuration = 60
                    var codeInterVal = setInterval(() => {
                        self.data.codeDuration--
                        $("#SendMsgCode").text(self.data.codeDuration + 's');
                        if (self.data.codeDuration === 0) {
                            if (codeInterVal) {
                                clearInterval(codeInterVal)
                                codeInterVal = null
                                $("#SendMsgCode").removeAttr("disabled");
                                $("#SendMsgCode").text('获取验证码');
                            }
                        }
                    }, 1000)
                }).catch(res => {
                    $.toast("发送验证码失败", "forbidden");
                });
			},
			//绑定登录
			bindlogin: function () {
				var self = this;
				var mobile = $("#mobile").val();
				if (!mobile) {
					$.toast("请输入手机号码", "forbidden");
					return
				}
				var code = $("#code").val();
				if (!code) {
					$.toast("请输入验证码", "forbidden");
					return
				}
				if (!/^1[34578]\d{9}$/.test(mobile)) {
					$.toast("手机号码填写错误", "forbidden");
					return
				}
				$.showLoading("登录中...");
				let user = this.data.user;

                lobsterh5.POST("/admin/v1/CLogin/LoginByWeiXinPhone", {
                    phone: mobile,
                    smsKey: self.data.smsKey,
                    smsCode: code,
                    nickName: user.nickname,
                    imgUrl: user.headimgurl,
                    openId: user.openid,
                    unionId: user.unionid,
                    sex: user.sex,
                    workId: lobsterh5.GetWorkId() || -1
                }).then(data => {
                    $.hideLoading();
                    $.toast("登录成功", "text");
                    lobsterh5.SucceedLogin(data);
                    self.reDirectTo();
                }).catch(res => {
                    self.data.loginBtnLoading = false
                    $.toast(res.msg, "forbidden");
                });
			},
			/**
			 * 跳转页面
			 * **/
			reDirectTo: function () {
				var self = this;
				if (self.data.backUrl) {
					location.href = self.data.backUrl;
				}
			},
		}, false);
</script>